<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" session="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <meta name="renderer" content="webkit">
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
    <META HTTP-EQUIV="Expires" CONTENT="0">
    <title>单元管理</title>

    <link href="${pageContext.request.contextPath}/static/css/common.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/plugins/bootstrap-3.3.5/css/bootstrap.min.css"
          rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/plugins/font-awesome-4.3.0/css/font-awesome.min.css"
          rel="stylesheet">
    <!-- jqgrid-->
    <link href="${pageContext.request.contextPath}/static/plugins/jqGrid/css/custom.ui.jqgrid.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/plugins/layer/skin/layer.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/plugins/jqGrid/css/style.css" rel="stylesheet">

    <script src="${pageContext.request.contextPath}/static/js/jquery-1.11.3.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/js/jquery.form.js"></script>
    <script src="${pageContext.request.contextPath}/static/js/common.js"></script>
    <script src="${pageContext.request.contextPath}/static/plugins/bootstrap-3.3.5/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/plugins/jqGrid/js/i18n/grid.locale-cn.js"></script>
    <script src="${pageContext.request.contextPath}/static/plugins/jqGrid/js/minified/jquery.jqGrid.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/plugins/layer/layer.js" type="text/javascript"></script>
    <script src="${pageContext.request.contextPath}/static/js/global.js"></script>
	<script src="${pageContext.request.contextPath}/static/plugins/select2-4.0.0/dist/js/select2.min.js"></script>
	<script type="text/javascript"
            src="${pageContext.request.contextPath}/static/plugins/My97DatePicker/WdatePicker.js"></script>

    <style type="text/css">
        .main h5 a {
            position: absolute;
            right: 20px;
            font-size: 14px;
            bottom: 0px;
            display: inline-block;
            padding: 5px;
        }

        .table_list tbody tr {
            height: 35px;
            text-align: center;
        }
          .left ul li{
			
			*line-height:40px;
			
			*padding-left:20px;
		}
		
		.left ul li a, .left ul li a:hover{
			*color:#fff;
		}
		.panel,.jqGrid_wrapper{
			*+margin-left:270px;
		}
		.btn{
		*+width:60px;
		}
		.lt{
			float:left;
		}
		.form-group{
			*+overflow:hidden;
		}
		.form-control{
			*+padding:0;
		}
		.selectdivs{
			width:134px !important;
		}
    </style>
</head>
<body view="menu-item-4142">
<jsp:include page="../../top.jsp"></jsp:include>
<div class="right">
    <div class="wrapper">
    <div class="panel panel-default">
            <div class="panel-heading">
                <span><strong>查询条件</strong></span>

                <div class="ibox-tools">
                    <a class="collapse-link"> <i class="fa fa-chevron-down"></i></a>
                    <a class="collapse-link  d-n"> <i class="fa fa-chevron-up"></i></a>
                </div>
            </div>
            <div class="panel-body">
                <form class="form-horizontal">
		                <div class="form-group">
		               		<label class="selectlabe1 col-md-1 form-lable lt">楼栋：</label>
		                    <div class="selectdivs col-md-3 lt">
		                        <select name="cBuildingId" id="cBuildingId" class="form-control col-md-1"></select>
		                    </div>
		                    
		                    <label class="selectlabe2 col-md-1 form-lable lt" style="width: 90px;">单元：</label>
		                    <div class="selectdivs col-md-3 lt" >
		                        <select name="unitId" id="unitId" class="form-control col-md-1"></select>
		                    </div>
		                    <label class="selectlabe2 col-md-1 form-lable lt">房间号：</label>
	                        <div class="selectdivs col-md-3 lt" >
	                            <input id="roomNo" name="roomNo" type="text" class="form-control"/>
	                        </div>
		         		</div>
                      <div class="form-group">
                        <label class="selectlabe1 col-md-1 form-lable lt" >户主姓名：</label>
                        <div class="selectdivs col-md-3 lt" >
                            <input id="ownerName" name="ownerName" type="text" class="form-control"/>
                        </div>
                        
                       	<label class="selectlabe2 col-md-1 form-lable lt">电&nbsp;&nbsp;话：</label>
                        <div class="selectdivs col-md-3 lt" >
                            <input id="tel" name="tel" type="text" class="form-control"/>
                        </div>
	                    <label class="selectlabe2 col-md-1 form-lable lt">身份证号：</label>
                        <div class="selectdivs col-md-3 lt" >
                            <input id="idNo" name="idNo" type="text" class="form-control"/>
                        </div>
                        <div class="col-md-1 form-action lt">
                            <button class="btn btn-success form-control" id="query">查询</button>
                        </div>
                        <div class="col-md-1 form-action lt">
                            <button class="btn btn-success form-control" id="resetForm">清空</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
	    <div class="jqGrid_wrapper">
	        <div id="jqGrid_operation" class="jg-grid">
	            <div class="jqGrid_operation" id="action"></div>
	        </div>
	        <table id="jqGrid"></table>
	        <div id="jqGrid_paper"></div>
	    </div>
	</div>
</div>
<script>
    $(document).ready(
            function () {
            	 $.ajax({
                     type: "POST",
                     async: false,
                     url: '/admin/auth_buttons.action',
                     data: "url=" + window.location.pathname,
                     success: function (data) {
                         data = eval("(" + data + ")");
                         for (var i in data) {
                             var action = data[i].mName;
                             switch (action) {
                                 case "房间新增":
                                     $("#action").append("<a id=\"add\"><i class=\"glyphicon glyphicon-plus\"></i>添加房间</a>");
                                     $("#add").click(function () {
                                         layer.open({
                                             type: 2,
                                             title: ['添加房间', 'font-weight:bold'],
                                             shadeClose: true, //点击遮罩关闭层
                                             area: ['800px', '500px'],
                                             scrollbar: false,
                                             content: '${pageContext.request.contextPath}/admin/croom_addView.action?communityId=${communityId}',
                                             btn: ['提交', '取消'],
                                             yes: function (index, layero) {
                                                 var options = {
                                                     success: function (data) {
                                                         data = JSON.parse(data);
                                                         if (data.code == 1) {
                                                             layer.alert(data.msg, function () {
                                                                 layer.closeAll();
                                                                 refreshGrid();
                                                             });
                                                         } else {
                                                             layer.alert(data.msg);
                                                         }
                                                     }
                                                 };
                                                 
                                             	 $("#layui-layer-iframe" + index).contents().find("#form").ajaxForm(options);
                                            	 $("#layui-layer-iframe" + index).contents().find("#form").submit();  	
                                             },
                                             cancel: function (index, layero) {
                                                 layer.close(index);
                                             }
                                         });
                                     });
                                     break;
                                 /* case "房间删除":
                                     $("#action").append("<a id=\"del\"><i class=\"glyphicon glyphicon-trash\"></i>删除</a>");
                                     $("#del").click(function () {
                                         var sels = jQuery("#jqGrid").jqGrid('getGridParam', 'selarrrow');
                                         if (sels == "") {
                                             layer.alert("请选择要删除的记录", {
                                                 icon: 6,
                                                 closeBtn: false
                                             });
                                         } else {
                                             layer.confirm('确认删除所选择的记录', function (index) {
                                                 $.post("${pageContext.request.contextPath}/admin/croom_delete.action", {
                                                     "ids": sels.toString()
                                                 }, function (result) {
                                                     result = eval("(" + result + ")");
                                                     layer.alert(result.msg);
                                                     refreshGrid();
                                                 });
                                                 layer.close(index);
                                             });
                                         }
                                     });
                                     break; */
                                 case "批量导入":
                                     $("#action").append("<a id=\"import\"><i class=\"glyphicon glyphicon-plus\"></i>批量导入</a>");
                                     $("#import").click(function () {
                                         layer.open({
                                             type: 2,
                                             title: ['批量导入', 'font-weight:bold'],
                                             shadeClose: true, //点击遮罩关闭层
                                             area: ['800px', '500px'],
                                             scrollbar: false,
                                             content: '${pageContext.request.contextPath}/admin/croom_importView.action',
                                             btn: ['提交', '取消'],
                                             yes: function (index, layero) {
                                                 var options = {
                                                     success: function (data) {
                                                         data = JSON.parse(data);
                                                         if (data.code == 1) {
                                                             layer.alert(data.msg, function () {
                                                                 layer.closeAll();
                                                                 refreshGrid();
                                                             });
                                                         } else {
                                                             layer.alert(data.msg);
                                                         }
                                                     }
                                                 };
                                                 
                                             	 $("#layui-layer-iframe" + index).contents().find("#form").ajaxForm(options);
                                            	 $("#layui-layer-iframe" + index).contents().find("#form").submit();  	
                                             },
                                             cancel: function (index, layero) {
                                                 layer.close(index);
                                             }
                                         });
                                     });
                                     break;
                             }
                         }
                     }
                 });
                 
                $.jgrid.defaults.styleUI = "Bootstrap";
                $("#jqGrid").jqGrid(
                        {
                            url: "${pageContext.request.contextPath}/admin/croom_list.action?communityId=${communityId}",
                            mtype: 'POST',
                            datatype: "json",
                            height: 400,
                            autowidth: true,
                            shrinkToFit: true,
                            rowNum: 10,
                            rowList: [10, 20, 30],
                            colNames: ['序号', '楼栋房间','状态','户主','电话','身份证号','操作'],
                            colModel: [{
                                name: "SID",
                                index: "SID",
                                key: true,
                                hidden: true
                            }, {
                                name: 'ROOMNO',
                                index: 'ROOMNO'
                            }, {
                                name: 'STATUS',
                                index: 'STATUS',
                                formatter: "select",
                                editoptions: {value: "null:自住;1:自住;2:出租;3:空置;"}
                            },{
                                name: 'OWNER_NAME',
                                index: 'OWNER_NAME'
                            }, {
                                name: 'OWNER_TEL',
                                index: 'OWNER_TEL'
                            }, {
                                name: 'OWNER_ID_NUMBER',
                                index: 'OWNER_ID_NUMBER'
                            }, {
                                name: 'SID',
                                index: 'SID',
                                formatter: function (cellvalue, options, rawObject) {
                                	if(cellvalue == '-1'){
                                     	return '';
                                    }else{
                                         return '<input type="button" style="padding: 2px 10px" class="btn btn-success" value="修改" onclick="edit('
                                                 + rawObject.SID + ')">';
                                     }
                                }
                            }],
                            sortname: 't.sid',
                            sortorder:'desc',
                            rownumbers: true,
                            jsonReader: {
                                root: 'rows',
                                page: "page",
                                total: 'total',
                                records: "records",
                                repeatitems: false
                            },
                            pager: "#jqGrid_paper",
                            viewrecords: true,
                            multiselect: true,
                            hidegrid: false,
                            loadComplete: function(){
                        		var re_records = Number($("#jqGrid").getGridParam('records'));
                        		var page = Number($("#jqGrid").getGridParam('page'));
                        		var rows=Number($("#jqGrid").getGridParam('rowNum'));
                        		var num = re_records-(page-1)*rows;
                        		if(num < rows)
                        		{
                        			for(var i=num;i<rows;i++){
                        				$("#jqGrid").jqGrid("addRowData",(i+1),
                                				{ "SID":"", "CBUILDINGID":"", "CBNAME":"", "SID":"-1"}
                        				,"");
                        			}
                        			$(".ui-paging-info").html(re_records-num+1 +" - "+re_records+"　共 "+re_records+" 条");
                        		}
                        	}
                        });
                
                <!--查询-->
                jQuery("#query").click(query);
                jQuery("#resetForm").click(resetForm);

                $.post("${pageContext.request.contextPath}/admin/cbuilding_list.action",{"communityId": '${communityId}'},function (data) {
                    $("#cBuildingId").empty();
                    $("#cBuildingId").append("<option value=''>请选择楼栋</option>");
                    for (var i = 0; i < data.length; i++) {
                        $("#cBuildingId").append("<option value='" + data[i].sid + "'>" + data[i].cbName + "</option>");
                    }
                     $("#cBuildingId").change(function () {
                       	var data = $(this).val();
                       	$.post("${pageContext.request.contextPath}/admin/cinstallunit_listUnit.action", {"bsid": data},function (data) {
            	            $("#unitId").empty();
            	            $("#unitId").append("<option value=''>请选择单元</option>");
            	            for (var i = 0; i < data.length; i++) {
            	                $("#unitId").append("<option value='"+data[i].SID+"'>"+data[i].CBNAME+"</option>");
            	            }
            	        }, "json");
                       })
                }, "json");
            });

    <!--刷新jqGrid表格数据-->
    function refreshGrid() {
        $("#jqGrid").trigger("reloadGrid");
    }
    function resetForm() {
        location.reload();
        return false;
    }
    function edit(id){
    	layer.open({
            type: 2,
            title: ['修改房间', 'font-weight:bold'],
            shadeClose: true, //点击遮罩关闭层
            area: ['800px', '510px'],
            scrollbar: false,
            content: '${pageContext.request.contextPath}/admin/croom_editView.action?communityId=${communityId}&sid='+id,
            btn: ['提交', '取消'],
            yes: function (index, layero) {
                var options = {
                    success: function (data) {
                        data = JSON.parse(data);
                        if (data.code == 1) {
                            layer.alert(data.msg, function () {
                                layer.closeAll();
                                refreshGrid();
                            });
                        } else {
                            layer.alert(data.msg);
                        }
                    }
                };
                $("#layui-layer-iframe" + index).contents().find("#form").ajaxForm(options);
                $("#layui-layer-iframe" + index).contents().find("#form").submit();
            },
            cancel: function (index, layero) {
                layer.close(index);
            }
        });
    }

    function query() {
        var cBuildingId = $("#cBuildingId").val();
        var unitId = $("#unitId").val();
        var roomNo = $("#roomNo").val();
        var ownerName = $("#ownerName").val();
        var tel = $("#tel").val();
        var idNo = $("#idNo").val();
        $("#jqGrid").jqGrid('setGridParam', {
            url: "${pageContext.request.contextPath}/admin/croom_list.action",
            postData: {
            	'cBuildingId':cBuildingId,
                'unitId': unitId,
                'roomNo': roomNo,
                'ownerName': ownerName,
                'tel': tel,
                'idNo': idNo,
                'communityId':'${communityId}'
            }, //发送数据
            page: 1
        }).trigger("reloadGrid"); //重新载入*/
        return false;
    }
</script>
</body>
</html>
